<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    
  </style>
</head>
<body>
  
</body>
<script>

  // let n = 0;

  // let x = 10;
  // let a = function(){
  //   // 拦截到a的使用时机
  //   n++
  //   return x;
  // }
  // function setA(msg){
  //   console.log(`a被修改成了${msg}`)
  //   x = msg;
  // }
  
  // let b = a() + 10;
  // a();
  // a();
  // a();
  // console.log( a() );
  // console.log( a() );
  // setA("hello");
  // console.log( a() );
  // console.log( a() );
  // console.log( a() );
  // console.log( `a被使用了${n}次` )

  // ===========

  // 自定义的访问器和控制器

  // const obj = {
  //   _a: 10,
  //   getA(){
  //     // ...此处可以拦截访问动作...
  //     return this._a;
  //   },
  //   setA(msg){
  //     // ...此处可以拦截修改动作...
  //     this._a = msg;
  //   }
  // }

  // console.log(obj.getA())
  // console.log(obj.getA())
  // obj.setA("hello");
  // console.log(obj.getA())
  // console.log(obj.getA())
  // console.log(obj.getA())
  // console.log(obj.getA())


  // 对象属性的访问器和控制器
  // 用来分别拦截属性的获取和修改


  // ===========

  // 内置的访问器和控制器

  const obj = {
    _a: 10,
    get abc(){
      console.log("a被访问了");
      return this._a
    },
    set abc(val){
      console.log("a被修改成了"+val);
      this._a = val;
    }
  }

  console.log(obj);

  console.log( obj.abc );
  
  obj.abc = "hello";
  obj.abc;
  
  console.log( obj.abc );

  


</script>
</html>